<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>4-H5新增获取元素</title>
		<style type="text/css">
			p{
				
			}
			.baidu{
				
			}
			p.baidu{
				
			}
			p[class='baidu']{
				
			}
		</style>
	</head>
	<body>
		<p class="baidu">百度</p>
		<p id='sina'>新浪</p>
		<p class="ali">阿里</p>
		<span class="box">中国1</span>
		<span class="box">中国2</span>
		<span class="box">中国3</span>
		<script type="text/javascript">
			//1.通过类名获取元素对象集合 document.getElementByClassName()
			var baidu = document.getElementsByClassName('baidu');
			console.log(baidu);
			//2.通过指定选择器返回元素对象
			var sina = document.querySelector('#sina');
			console.log(sina);
			var ali = document.querySelector('.ali');
			console.log(ali);
			//
			var spans = document.querySelectorAll('.box');
			console.log(spans);
			
			
			
		</script>
	</body>
</html>
